{% load static %}
{% load bootstrap3 %}
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>
            {% block title %}{{ common_long_name }} - {{ path_info|title }}{% endblock title %}
        </title>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet"
              type="text/css"
              href="{% static 'django_tables2/themes/paleblue/css/screen.css' %}"/>
        <link rel="shortcut icon" href="{% static 'rules/favicon.ico' %}" />
        <script src="{% static 'dist/scirius-bundle.js' %}"></script>
        {% block head %}{% endblock head %}
        <link rel="stylesheet"
              type="text/css"
              href="{% static 'dist/styles.css' %}"/>
        {% if settings.CUSTOM_CSS %}<link rel="stylesheet" type="text/css" href="{{ settings.CUSTOM_CSS }}" />{% endif %}
    </head>
    {% block body %}<body>{% endblock body %}
    <div class="container-fluid">
        <nav class="navbar navbar-default" role="navigation">
            <div class="container-fluid">
                <div class="navbar-header">
                    <a class="navbar-dropdown collapsed"
                       data-target="sc_menu"
                       data-toggle="dropdown"
                       id="logo"
                       style="cursor: pointer;">
                        <img src="{% static 'rules/stamus.png' %}" id="img-logo"/>
                        <span class="caret"/>
                    </a>
                    <ul class="dropdown-menu" id="sc_menu" role="menu">
                        {% if perms.rules.configuration_view %}
                            <li>
                                <a href="{% url 'system_settings' %}">{% bootstrap_icon "list-alt" %} System settings</a>
                            </li>
                        {% endif %}
                        {% block menusettings %}
                            {% if links %}
                                <li role="presentation" class="divider"></li>
                                {% for link in links %}
                                    <li>
                                        <a href="{% url link.url %}">{% bootstrap_icon link.icon %} {{ link.name }}</a>
                                    </li>
                                {% endfor %}
                            {% endif %}
                        {% endblock menusettings %}
                        {% if perms.rules.configuration_view or links %}<li role="presentation" class="divider"></li>{% endif %}
                        <li>
                            <a href="{% url 'history' %}">{% bootstrap_icon "time" %} Action History</a>
                        </li>
                        {% if perms.rules.configuration_auth %}
                            <li>
                                <a href="{% url 'list_accounts' %}">{% bootstrap_icon "user" %} Manage accounts</a>
                            </li>
                        {% endif %}
                    </ul>
                    <button type="button"
                            class="navbar-toggle"
                            data-toggle="collapse"
                            data-target="#top-menu-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <span class="logo-title">{{ app_mngt_name }}</span>
                </div>
                <div class="navbar-collapse collapse" id="top-menu-collapse">
                    <ul class="nav navbar-nav" id="top_menu">
                        <li>
                            <a id="home" href="{% url 'rules_index' %}">{% bootstrap_icon "home" %} Home</a>
                        </li>
                        {% if perms.rules.source_view %}
                            <li>
                                <a id="source" href="{% url 'sources' %}">{% bootstrap_icon "cloud-download" %} Sources</a>
                            </li>
                            <li>
                                <a id="ruleset" href="{% url 'rulesets' %}">{% bootstrap_icon "th" %} Rulesets</a>
                            </li>
                        {% endif %}
                        {% if toplinks %}
                            {% for link in toplinks %}
                                {% if link.perm %}
                                    <li>
                                        <a id="{{ link.id }}" href="{{ link.url }}">{% bootstrap_icon link.icon %} {{ link.label }}</a>
                                    </li>
                                {% endif %}
                            {% endfor %}
                        {% endif %}
                    </ul>
                    <div class="navbar-right">
                        <ul class="nav navbar-nav">
                            {% if perms.rules.ruleset_policy_view %}
                                <li>
                                    <a class="dropdown-toggle"
                                       id="display_search"
                                       data-toggle="dropdown"
                                       href="#">
                                        <span class="glyphicon glyphicon-search">
                                            <span class="caret"/></span>
                                        </a>
                                        <form class="dropdown-menu"
                                              id="display_search"
                                              action="{% url 'scirius_search' %}"
                                              method="post"
                                              role="search">
                                            {% csrf_token %}
                                            <span class="form-group sn-drop-down">
                                                <span class="glyphicon glyphicon-search">
                                                    <input type="text" name="search" id="id_search"/>
                                                </span>
                                            </span>
                                        </form>
                                    </li>
                                {% endif %}
                            </ul>
                            {% include 'rules/header_right.html' %}
                        </div>
                    </div>
                </div>
            </nav>
            {% block subnavigation %}{% endblock subnavigation %}
            <div class="row">
                <div class="col-md-2 col-sm-3">
                    <div class="panel panel-default" id="sys-status">
                        <div class="panel-heading">
                            <h2 class="panel-title">System status</h2>
                        </div>
                        <div class="panel-body">
                            {% if perms.rules.configuration_view %}
                                {% if generator == 'suricata' %}
                                    <div id="probe-status" class="label label-default space-add">
                                        <a href="/{{ generator }}/">Suricata</a>
                                    </div>
                                {% endif %}
                                {% if elasticsearch and not custom_elasticsearch %}
                                    <div id="health" class="label label-default space-add">
                                        <a href="{% url 'elasticsearch' %}">Elasticsearch</a>
                                    </div>
                                {% endif %}
                                <div id="disk-status" class="label label-default space-add">
                                    <a href="{% url monitoring_url %}">Disk</a>
                                </div>
                                <div id="memory-status" class="label label-default space-add">
                                    <a href="{% url monitoring_url %}">Memory</a>
                                </div>
                            {% endif %}
                        </div>
                    </div>
                    {% if generator != 'suricata' %}
                        <div class="panel panel-default" id="platform-status">
                            <div class="panel-heading">
                                <h2 class="panel-title">Platform status</h2>
                            </div>
                            <div class="panel-body">
                                {% if perms.rules.configuration_view %}
                                    <div id="probe-status" class="label label-default space-add">
                                        <a href="/{{ generator }}/">Probes</a>
                                    </div>
                                    {% if use_stamuslogger %}
                                        <div id="logger-status" class="label label-default space-add">
                                            <a href="/{{ generator }}/">Loggers</a>
                                        </div>
                                    {% endif %}
                                    {% if elasticsearch and custom_elasticsearch %}
                                        <div id="health" class="label label-default space-add">
                                            <a href="{% url 'elasticsearch' %}">Elasticsearch</a>
                                        </div>
                                    {% endif %}
                                {% endif %}
                            </div>
                        </div>
                    {% endif %}
                    <div class="panel panel-default" id="sidebar">
                        {% block sidebar %}
                            <div class="panel-heading">
                                <h2 class="panel-title">{{ common_long_name }}</h2>
                            </div>
                            <div class="panel-body">A web interface to manage Suricata rulesets</div>
                        {% endblock sidebar %}
                        {% if object_path %}
                            <div class="panel-heading">
                                <h2 class="panel-title">Path</h2>
                            </div>
                            <div class="panel-body">
                                <ol class="breadcrumb">
                                    {% for object in object_path %}
                                        <li>
                                            <a href="{{ object.get_absolute_url }}">{{ object.name }}</a>
                                        </li>
                                    {% endfor %}
                                </ol>
                            </div>
                        {% endif %}
                        {% block status %}
                            {% if middleware_status %}
                                {% include middleware_status %}
                            {% endif %}
                        {% endblock status %}
                    </div>
                    <!-- panel -->
                    {% if help_link %}
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h2 class="panel-title">
                                    {% bootstrap_icon "book" %} Help
                                </h2>
                            </div>
                            <div class="panel-body">
                                <a href="{% static help_link.base_url %}{{ help_link.anchor }}"
                                   target="_blank">
                                    {{ help_link.name }}
                                </a>
                            </div>
                        </div>
                    {% endif %}
                </div>
                <!-- col -->
                {% if three_columns %}
                    <div class="col-md-8 col-sm-9">
                    {% else %}
                        <div class="col-md-10 col-sm-9">
                        {% endif %}
                        <!-- Modal -->
                        <div class="modal bs-example-modal-sm"
                             id="scirius_down"
                             tabindex="-1"
                             role="dialog"
                             aria-labelledby="myModalLabel">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                            <span aria-hidden="true">
                                                &times;
                                            </span>
                                        </button>
                                        <h4 class="modal-title" id="myModalLabel">
                                            {{ scirius_short_title }} is down.
                                        </h4>
                                    </div>
                                    <div class="modal-body text-danger" id="scirius_down_text">
                                        {{ scirius_short_title }} is not currently available.
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-danger" data-dismiss="modal">
                                            Ignore
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- Generic modal -->
                        <div class="modal bs-example-modal-sm"
                             id="generic-modal"
                             tabindex="-1"
                             role="dialog"
                             aria-labelledby="myModalLabel">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                            <span aria-hidden="true">
                                                &times;
                                            </span>
                                        </button>
                                        <h4 class="modal-title" id="generic-modal-title">
                                        </h4>
                                    </div>
                                    <div class="modal-body" id="generic-modal-msg">
                                    </div>
                                    <div class="modal-body" id="generic-modal-comment-div">
                                        <label>
                                            Comment:
                                        </label>
                                        <div>
                                            <textarea id="generic-modal-comment" name="comment" rows="4" style="min-width: 100%"></textarea>
                                        </div>
                                    </div>
                                    <div class="modal-footer" id="generic-modal-footer">
                                        <button class="btn btn-primary" type="button" id="generic-modal-submit">
                                            <span class="glyphicon glyphicon-ok" id="generic-modal-submit-icon">
                                            </span>
                                            Ok
                                        </button>
                                        <button type="button"
                                                class="btn btn-default"
                                                id="generic-modal-cancel"
                                                data-dismiss="modal">
                                            Cancel
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div id="scirius_down_label" style="display:none;">
                            <div class="alert alert-danger">
                                {{ scirius_short_title }} is down. Don't leave page.
                            </div>
                        </div>
                        {% block extra_message %}
                            {% if additional_error %}
                                <div class="alert alert-danger alert-dismissible">
                                    <button type="button" class="close" data-dismiss="alert">
                                        <span aria-hidden="true">
                                            &times;
                                        </span>
                                        <span class="sr-only">
                                            Close
                                        </span>
                                    </button>
                                    <span id="error">
                                        {{ additional_error|safe }}
                                    </span>
                                </div>
                            {% endif %}
                        {% endblock extra_message %}
                        {% block error %}
                            {% if messages %}
                                {% for message in messages %}
                                    <div class="alert alert-dismissible alert-{% if message.tags %}{{ message.tags|lower|striptags }}{% endif %}">
                                        <button type="button" class="close" data-dismiss="alert">
                                            <span aria-hidden="true">
                                                &times;
                                            </span>
                                            <span class="sr-only">
                                                Close
                                            </span>
                                        </button>
                                        <span id="message">
                                            {{ message }}
                                        </span>
                                    </div>
                                {% endfor %}
                            {% endif %}
                            {% if error %}
                                <div class="alert alert-danger alert-dismissible">
                                    <button type="button" class="close" data-dismiss="alert">
                                        <span aria-hidden="true">
                                            &times;
                                        </span>
                                        <span class="sr-only">
                                            Close
                                        </span>
                                    </button>
                                    <span id="error">
                                        {{ error }}
                                    </span>
                                </div>
                            {% else %}
                                <div class="alert alert-danger alert-dismissible" style="display:none;">
                                    <button type="button" class="close" data-dismiss="alert">
                                        <span aria-hidden="true">
                                            &times;
                                        </span>
                                        <span class="sr-only">
                                            Close
                                        </span>
                                    </button>
                                    <span id="error">
                                        No error
                                    </span>
                                </div>
                                <div class="alert alert-info alert-dismissible" style="display:none;">
                                    <button type="button" class="close" data-dismiss="alert">
                                        <span aria-hidden="true">
                                            &times;
                                        </span>
                                        <span class="sr-only">
                                            Close
                                        </span>
                                    </button>
                                    <span id="info">
                                        No info
                                    </span>
                                </div>
                            {% endif %}
                            {% if success %}
                                <div class="alert alert-success alert-dismissible">
                                    <button type="button" class="close" data-dismiss="alert">
                                        <span aria-hidden="true">
                                            &times;
                                        </span>
                                        <span class="sr-only">
                                            Close
                                        </span>
                                    </button>
                                    <span id="error">
                                        {{ success }}
                                    </span>
                                </div>
                            {% endif %}
                            {% if warning %}
                                <div class="alert alert-warning alert-dismissible">
                                    <button type="button" class="close" data-dismiss="alert">
                                        <span aria-hidden="true">
                                            &times;
                                        </span>
                                        <span class="sr-only">
                                            Close
                                        </span>
                                    </button>
                                    <span id="error">
                                        {{ warning }}
                                    </span>
                                </div>
                            {% endif %}
                        {% endblock error %}
                        {% block content %}{% endblock content %}
                    </div>
                    <!-- col -->
                    {% if three_columns %}
                        <div class="col-md-2 col-sm-12">
                            {% block 3dcol %}{% endblock 3dcol %}
                        </div>
                    {% endif %}
                </div>
                <!-- row -->
                {% include "rules/footer.html" %}
            </div>
            <!-- class container -->
            <script>
var scirius_status = 'green';
var scirius_modal = false;

function get_scirius_status() {
    $.ajax({
        type:"GET",
        url:"{% url 'info' %}",
        success: function(data) {
            if (!data) {
                scirius_status = 'red';
                if (!scirius_modal) {
                    $("#scirius_down").modal('show');
                }
            } else {
                if (data['status'] == 'green') {
                    scirius_status = 'green';
                    $("#scirius_down").modal('hide');
                    $("#sys-status").show(300);
                    $("#scirius_down_label").hide(duration=200);
                    scirius_modal = false;
                    start_interval_check();
                    return;
                } else {
                    let title = "{{ scirius_short_title|safe }}";
                    $("#scirius_down_text").text(`${title} does not feel comfortable`);
                    scirius_status = 'red';
                    if (!scirius_modal) {
                        $("#scirius_down").modal('show');
                        scirius_modal = true;
                    }
                }
            }
        },
        error: function(data) {
            if (scirius_status != 'red') {
                scirius_status = 'red';
                $("#scirius_down_text").text("No connection with {{ common_long_name }}. This pop-up will disappear if connection is restored.");
                $("#sys-status").hide(1000);
                $("#scirius_down_label").show(duration=200);
                if (scirius_modal == false) {
                    $("#scirius_down").modal('show');
                    scirius_modal = true;
                }
            }
        },
        timeout: 15000,
    });
}

            </script>
            {% if elasticsearch and perms.rules.configuration_view %}
                <script>
function get_es_health() {

    if (scirius_status == "red") {
        return;
    }

    $.ajax({
        type:"GET",
        url: "{% url 'es_health' %}",
        success: function(data) {
            if (!data) {
                $("#health").removeClass("label-default");
                $("#health").removeClass("label-success");
                $("#health").removeClass("label-warning");
                $("#health").removeClass("label-danger");
                $("#health").addClass("label-danger");
            } else {
                $("#health").removeClass("label-default");
                $("#health").removeClass("label-success");
                $("#health").removeClass("label-warning");
                $("#health").removeClass("label-danger");
                if (data['status'] == 'green') {
                    $("#health").addClass("label-success");
                } else if (data['status'] == 'yellow') {
                    $("#health").addClass("label-warning");
                } else if (data['status'] == 'red') {
                    $("#health").addClass("label-danger");
                }
            }
        },
        error: function(data) {
                // Wait before running the check, to avoid flooding
                // when ES is not available
                setTimeout(start_down_check, 5000);
        },
        timeout: 15000,
    });
}

                </script>
            {% endif %}
            <script>
function get_suricata_health() {
    if (scirius_status == "red") {
        return;
    }

    $.ajax({
        type:"GET",
        url:"{% url 'info' %}?query=status",
        success: function(data) {
            $("#probe-status").removeClass("label-danger");
            $("#probe-status").removeClass("label-default");
            $("#probe-status").removeClass("label-success");
            $("#probe-status").removeClass("label-warning");

            {% if generator != 'suricata' and use_stamuslogger %}
                $("#logger-status").removeClass("label-danger");
                $("#logger-status").removeClass("label-default");
                $("#logger-status").removeClass("label-success");
                $("#logger-status").removeClass("label-warning");
            {% endif %}

            if (!data) {
                $("#probe-status").addClass("label-danger");
                $("#logger-status").addClass("label-danger");
            } else {
                $("#probe-status").addClass("label-" + data['probe']);
                {% if generator != 'suricata' and use_stamuslogger %}
                    $("#logger-status").addClass("label-" + data['logger']);
                {% endif %}
            }
        },
        error: function(data) {
            start_down_check();
        },
        timeout: 15000,
    });
}

function set_info_card(key, data) {
	$(key + " .progress-bar").width("" + data + "%");
	$(key + " .progress-bar").prop("aria-valuenow", data);
	$(key + " .progress-bar").prop("title", "" + data + "% Used");
	$(key + " .progress-bar span").text("" + data + "% Used");
	$(key + " .progress-bar-remaining").width("" + (100 - data) + "%");
	$(key + " .progress-bar-remaining").prop("aria-valuenow", data);
	$(key + " .progress-bar-remaining").prop("title", "" + (100 - data) + "% Available");
	$(key + " .progress-bar-remaining span").text("" + data + "% Available");
	jQuery('[data-toggle="tooltip"]').tooltip();
}

function get_disk_health() {
    if (scirius_status == "red") {
        return;
    }
    $.ajax({
        type:"GET",
        url:"{% url 'info' %}?query=disk",
        success: function(data) {
            $("#disk-status").removeClass("label-danger");
            $("#disk-status").removeClass("label-default");
            $("#disk-status").removeClass("label-success");
            $("#disk-status").removeClass("label-warning");
            if (!data) {
                    $("#disk-status").addClass("label-danger");
            } else {
		        set_info_card("#disk-status-card-bar", data[3]);
                if (data[3] > 90) {
                    $("#disk-status").addClass("label-danger");
                } else if (data[3] > 80) {
                    $("#disk-status").addClass("label-warning");
                } else {
                    $("#disk-status").addClass("label-success");
                }
            }
        },
        error: function(data) {
            start_down_check();
        },
        timeout: 15000,
    });
}

function get_memory_health() {
    if (scirius_status == "red") {
        return;
    }
    $.ajax({
        type:"GET",
        url:"{% url 'info' %}?query=used_memory",
        success: function(data) {
            $("#memory-status").removeClass("label-danger");
            $("#memory-status").removeClass("label-default");
            $("#memory-status").removeClass("label-success");
            $("#memory-status").removeClass("label-warning");
            if (!data) {
                $("#memory-status").addClass("label-danger");
            } else {
		        set_info_card("#mem-status-card-bar", data);
                if (data > 95) {
                    $("#memory-status").addClass("label-danger");
                } else if (data > 85) {
                    $("#memory-status").addClass("label-warning");
                } else {
                    $("#memory-status").addClass("label-success");
                }
            }
        },
        error: function(data) {
            start_down_check();
        },
        timeout: 15000,
    });
}

function get_cpu_health() {
    if (scirius_status == "red") {
        return;
    }
    if (document.URL.indexOf("suricata") == -1) {
	    return;
    }
    $.ajax({
        type:"GET",
        url:"{% url 'info' %}?query=cpu",
        success: function(data) {
            if (data) {
		        set_info_card("#cpu-status-card-bar", data);
		    }
        },
        error: function(data) {
            start_down_check();
        },
        timeout: 15000,
    });
}

function call_health_functions() {
    get_suricata_health();
    get_disk_health();
    get_memory_health();
    get_cpu_health();
{% if elasticsearch and perms.rules.configuration_view %}get_es_health();{% endif %}
}

var status_interval;

function start_interval_check() {
   call_health_functions();
   clear_interval_check();
   status_interval = setInterval(call_health_functions, 30000);
}

function clear_interval_check() {
   clearInterval(status_interval);
}

function start_down_check() {
   clear_interval_check();
   get_scirius_status();
   status_interval = setInterval(get_scirius_status, 10000);
}

var idleTime = 0;
function timerIncrement(timeout) {
    idleTime = idleTime + timeout;
    $.ajax({
        type:"POST",
        url:"{% url 'sciriususer-session-activity' %}",
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        data: JSON.stringify({'timeout': idleTime}),
        success: function(data) {
            if (data.disconnect) {
                window.location = `{{ settings.LOGIN_URL }}${window.location.pathname.slice(1)}`;
            }
        },
        error: function(data) {
            if (data.status === 403) {
                window.location = `{{ settings.LOGIN_URL }}${window.location.pathname.slice(1)}`;
            }
        }
    });
}

$(document).ready(function () {
    // Increment the idle time counter every 30sec.
    var timeout = 30000;
    var idleInterval = setInterval(timerIncrement, timeout, timeout / 1000);

    $(this).mousemove(function (e) {
        idleTime = 0;
    });
    $(this).keypress(function (e) {
        idleTime = 0;
    });
});

$( 'document' ).ready(start_interval_check());

$(function (){
    $('a[data-toggle="tab"]').on('click', function(e) {
        $(this).closest('li').siblings().removeClass('active');
        $(this).closest('li').addClass('active');
    });
});

            </script>
        </body>
    </html>
